<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <title>FormItem 表单项 | MyUI 4.x</title>
    <meta name="generator" content="VuePress 1.7.1">
    <link rel="icon" href="/my/favicon.ico">
    <script>
      var _hmt = _hmt || [];
      (function() {
        var hm = document.createElement("script");
        hm.src = "https://hm.baidu.com/hm.js?c4e5f73318b5cb0c389e3d9a05f831cc";
        var s = document.getElementsByTagName("script")[0];
        s.parentNode.insertBefore(hm, s);
      })();
    </script>
    <meta name="description" content="MyUI是美亚柏科旗下新德汇出品的Web前端一站式项目工程框架，专注于公检法行业中台系统快速搭建，框架已在多个项目实战检验。">
    <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
    <meta http-equiv="Pragma" content="no-cache">
    <meta http-equiv="Expires" content="0">
    
    <link rel="preload" href="/my/assets/css/0.styles.82a18d97.css" as="style"><link rel="preload" href="/my/assets/js/app.fc4964fc.js" as="script"><link rel="preload" href="/my/assets/js/513.edb84f11.js" as="script"><link rel="preload" href="/my/assets/js/1431.f2b77d63.js" as="script"><link rel="preload" href="/my/assets/js/958.935c6658.js" as="script">
    <link rel="stylesheet" href="/my/assets/css/0.styles.82a18d97.css">
  </head>
  <body>
    <div id="app" data-server-rendered="true"><div class="theme-container"><header class="navbar"><div class="sidebar-button"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" viewBox="0 0 448 512" class="icon"><path fill="currentColor" d="M436 124H12c-6.627 0-12-5.373-12-12V80c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12z"></path></svg></div> <a href="/my/" class="home-link router-link-active"><img src="/my/img/logo.png" alt="MyUI 4.x" class="logo"> <span class="site-name can-hide">MyUI 4.x</span></a> <div class="links"><div class="search-box"><input aria-label="Search" autocomplete="off" spellcheck="false" value=""> <!----></div> <nav class="nav-links can-hide"><div class="nav-item"><a href="/my/guide/" class="nav-link">
  指南
</a></div><div class="nav-item"><a href="/my/ui/components/" class="nav-link router-link-active">
  组件
</a></div><div class="nav-item"><a href="/my/ui/charts/" class="nav-link">
  图表
</a></div><div class="nav-item"><a href="/my/ui/map/" class="nav-link">
  地图
</a></div><div class="nav-item"><a href="/my/ui/go/" class="nav-link">
  关系图
</a></div><div class="nav-item"><a href="/my/ui/icon/" class="nav-link">
  图标
</a></div><div class="nav-item"><a href="/my/ui/pages/" class="nav-link">
  页面
</a></div><div class="nav-item"><a href="http://newgateway.gitee.io/my-web/" target="_blank" rel="noopener noreferrer" class="nav-link external">
  演示
  <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div><div class="nav-item"><div class="dropdown-wrapper"><button type="button" aria-label="JSDoc" class="dropdown-title"><span class="title">JSDoc</span> <span class="arrow down"></span></button> <button type="button" aria-label="JSDoc" class="mobile-dropdown-title"><span class="title">JSDoc</span> <span class="arrow right"></span></button> <ul class="nav-dropdown" style="display:none;"><li class="dropdown-item"><!----> <a href="/my/api/components.html" class="nav-link">
  基础组件
</a></li><li class="dropdown-item"><!----> <a href="/my/api/utils.html" class="nav-link">
  工具函数
</a></li><li class="dropdown-item"><!----> <a href="/my/api/charts.html" class="nav-link">
  图表组件
</a></li><li class="dropdown-item"><!----> <a href="/my/api/map.html" class="nav-link">
  地图组件
</a></li></ul></div></div> <!----></nav></div></header> <div class="sidebar-mask"></div> <aside class="sidebar"><nav class="nav-links"><div class="nav-item"><a href="/my/guide/" class="nav-link">
  指南
</a></div><div class="nav-item"><a href="/my/ui/components/" class="nav-link router-link-active">
  组件
</a></div><div class="nav-item"><a href="/my/ui/charts/" class="nav-link">
  图表
</a></div><div class="nav-item"><a href="/my/ui/map/" class="nav-link">
  地图
</a></div><div class="nav-item"><a href="/my/ui/go/" class="nav-link">
  关系图
</a></div><div class="nav-item"><a href="/my/ui/icon/" class="nav-link">
  图标
</a></div><div class="nav-item"><a href="/my/ui/pages/" class="nav-link">
  页面
</a></div><div class="nav-item"><a href="http://newgateway.gitee.io/my-web/" target="_blank" rel="noopener noreferrer" class="nav-link external">
  演示
  <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div><div class="nav-item"><div class="dropdown-wrapper"><button type="button" aria-label="JSDoc" class="dropdown-title"><span class="title">JSDoc</span> <span class="arrow down"></span></button> <button type="button" aria-label="JSDoc" class="mobile-dropdown-title"><span class="title">JSDoc</span> <span class="arrow right"></span></button> <ul class="nav-dropdown" style="display:none;"><li class="dropdown-item"><!----> <a href="/my/api/components.html" class="nav-link">
  基础组件
</a></li><li class="dropdown-item"><!----> <a href="/my/api/utils.html" class="nav-link">
  工具函数
</a></li><li class="dropdown-item"><!----> <a href="/my/api/charts.html" class="nav-link">
  图表组件
</a></li><li class="dropdown-item"><!----> <a href="/my/api/map.html" class="nav-link">
  地图组件
</a></li></ul></div></div> <!----></nav>  <ul class="sidebar-links"><li><section class="sidebar-group collapsable depth-0"><p class="sidebar-heading"><span>功能辅助</span> <span class="arrow right"></span></p> <!----></section></li><li><section class="sidebar-group collapsable depth-0"><p class="sidebar-heading"><span>基础元件</span> <span class="arrow right"></span></p> <!----></section></li><li><section class="sidebar-group collapsable depth-0"><p class="sidebar-heading"><span>排版布局</span> <span class="arrow right"></span></p> <!----></section></li><li><section class="sidebar-group collapsable depth-0"><p class="sidebar-heading"><span>容器修饰</span> <span class="arrow right"></span></p> <!----></section></li><li><section class="sidebar-group collapsable depth-0"><p class="sidebar-heading"><span>导航菜单</span> <span class="arrow right"></span></p> <!----></section></li><li><section class="sidebar-group collapsable depth-0"><p class="sidebar-heading open"><span>数据录入</span> <span class="arrow down"></span></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/my/ui/components/cron.html" class="sidebar-link">Cron 表达式</a></li><li><a href="/my/ui/components/edit-tags.html" class="sidebar-link">EditTags 标签编辑（批量输入）</a></li><li><a href="/my/ui/components/editor.html" class="sidebar-link">Editor 富文本编辑器</a></li><li><a href="/my/ui/components/filter.html" class="sidebar-link">Filter 筛选条件表单</a></li><li><a href="/my/ui/components/form.html" class="sidebar-link">Form 表单</a></li><li><a href="/my/ui/components/form-item.html" aria-current="page" class="active sidebar-link">FormItem 表单项</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/my/ui/components/form-item.html#公用属性参数" class="sidebar-link">公用属性参数</a></li><li class="sidebar-sub-header"><a href="/my/ui/components/form-item.html#使用方式" class="sidebar-link">使用方式</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/my/ui/components/form-item.html#单独使用" class="sidebar-link">单独使用</a></li><li class="sidebar-sub-header"><a href="/my/ui/components/form-item.html#结合myform" class="sidebar-link">结合MyForm</a></li></ul></li><li class="sidebar-sub-header"><a href="/my/ui/components/form-item.html#通用功能" class="sidebar-link">通用功能</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/my/ui/components/form-item.html#样式设置" class="sidebar-link">样式设置</a></li><li class="sidebar-sub-header"><a href="/my/ui/components/form-item.html#输入组件参数" class="sidebar-link">输入组件参数</a></li><li class="sidebar-sub-header"><a href="/my/ui/components/form-item.html#选项数据" class="sidebar-link">选项数据</a></li><li class="sidebar-sub-header"><a href="/my/ui/components/form-item.html#数据加载函数" class="sidebar-link">数据加载函数</a></li><li class="sidebar-sub-header"><a href="/my/ui/components/form-item.html#折叠" class="sidebar-link">折叠</a></li><li class="sidebar-sub-header"><a href="/my/ui/components/form-item.html#依赖" class="sidebar-link">依赖</a></li><li class="sidebar-sub-header"><a href="/my/ui/components/form-item.html#级联" class="sidebar-link">级联</a></li></ul></li><li class="sidebar-sub-header"><a href="/my/ui/components/form-item.html#表单项组件" class="sidebar-link">表单项组件</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/my/ui/components/form-item.html#autocomplete-自动完成" class="sidebar-link">Autocomplete 自动完成</a></li><li class="sidebar-sub-header"><a href="/my/ui/components/form-item.html#cascader-级联选择器" class="sidebar-link">Cascader 级联选择器</a></li><li class="sidebar-sub-header"><a href="/my/ui/components/form-item.html#checkbox-多选框" class="sidebar-link">Checkbox 多选框</a></li><li class="sidebar-sub-header"><a href="/my/ui/components/form-item.html#colorpicker-颜色选择器" class="sidebar-link">ColorPicker 颜色选择器</a></li><li class="sidebar-sub-header"><a href="/my/ui/components/form-item.html#datepicker-日期时间选择器" class="sidebar-link">DatePicker 日期时间选择器</a></li><li class="sidebar-sub-header"><a href="/my/ui/components/form-item.html#editor-富文本编辑器" class="sidebar-link">Editor 富文本编辑器</a></li><li class="sidebar-sub-header"><a href="/my/ui/components/form-item.html#input-文本输入框" class="sidebar-link">Input 文本输入框</a></li><li class="sidebar-sub-header"><a href="/my/ui/components/form-item.html#inputnumber-数字输入框" class="sidebar-link">InputNumber 数字输入框</a></li><li class="sidebar-sub-header"><a href="/my/ui/components/form-item.html#radio-单选框" class="sidebar-link">Radio 单选框</a></li><li class="sidebar-sub-header"><a href="/my/ui/components/form-item.html#range-范围输入框" class="sidebar-link">Range 范围输入框</a></li><li class="sidebar-sub-header"><a href="/my/ui/components/form-item.html#rate-评分" class="sidebar-link">Rate 评分</a></li><li class="sidebar-sub-header"><a href="/my/ui/components/form-item.html#select-下拉选择框" class="sidebar-link">Select 下拉选择框</a></li><li class="sidebar-sub-header"><a href="/my/ui/components/form-item.html#slider-滑块" class="sidebar-link">Slider 滑块</a></li><li class="sidebar-sub-header"><a href="/my/ui/components/form-item.html#switch-开关" class="sidebar-link">Switch 开关</a></li><li class="sidebar-sub-header"><a href="/my/ui/components/form-item.html#taginput-标签输入框" class="sidebar-link">TagInput 标签输入框</a></li><li class="sidebar-sub-header"><a href="/my/ui/components/form-item.html#tagselect-标签选择" class="sidebar-link">TagSelect 标签选择</a></li><li class="sidebar-sub-header"><a href="/my/ui/components/form-item.html#treeselect-下拉树选择框" class="sidebar-link">TreeSelect 下拉树选择框</a></li></ul></li></ul></li><li><a href="/my/ui/components/location-picker.html" class="sidebar-link">LocationPicker 经纬度提取器</a></li><li><a href="/my/ui/components/login.html" class="sidebar-link">Login 登录</a></li><li><a href="/my/ui/components/range.html" class="sidebar-link">Range 范围输入框</a></li><li><a href="/my/ui/components/search-box.html" class="sidebar-link">SearchBox 搜索输入框</a></li><li><a href="/my/ui/components/tag-input.html" class="sidebar-link">TagInput 标签输入框</a></li><li><a href="/my/ui/components/tag-select.html" class="sidebar-link">TagSelect 标签选择器</a></li><li><a href="/my/ui/components/tree-select.html" class="sidebar-link">TreeSelect 下拉树</a></li></ul></section></li><li><section class="sidebar-group collapsable depth-0"><p class="sidebar-heading"><span>数据展示</span> <span class="arrow right"></span></p> <!----></section></li><li><section class="sidebar-group collapsable depth-0"><p class="sidebar-heading"><span>动画效果</span> <span class="arrow right"></span></p> <!----></section></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><h1 id="formitem-表单项"><a href="#formitem-表单项" class="header-anchor">#</a> FormItem 表单项</h1> <p>FormItem不是一个组件，是一系列数据录入组件的统称。 这些组件都有公共的属性、参数和功能。</p> <h2 id="公用属性参数"><a href="#公用属性参数" class="header-anchor">#</a> 公用属性参数</h2> <p>表单项的公共属性参数，继承 el-form-item 的的全部特性。 需要与MyForm结合使用才有效。</p> <table><thead><tr><th>参数名称</th> <th>类型</th> <th>默认值</th> <th>说明</th></tr></thead> <tbody><tr><td>name</td> <td>String</td> <td>-</td> <td>表单域 model 字段名称, 等价于 el-form-item 的 prop 参数</td></tr> <tr><td>width</td> <td>String</td> <td>-</td> <td>宽度，css属性，支持像素，百分比和表达式，也可以在MyForm中统一设置itemWidth</td></tr> <tr><td>props</td> <td>Object</td> <td>-</td> <td>输入组件参数对象，即 el-form-item 包含的组件参数</td></tr> <tr><td>options</td> <td>Array</td> <td>-</td> <td>选项数据，有选项的输入组件才有效</td></tr> <tr><td>keyMap</td> <td>Object</td> <td>{id, parentId, label, value}</td> <td>选项数据对象属性名称映射</td></tr> <tr><td>collapsible</td> <td>Boolean</td> <td>false</td> <td>可收起</td></tr> <tr><td>stopEnterEvent</td> <td>Boolean</td> <td>false</td> <td>阻止回车事件冒泡</td></tr> <tr><td>depend</td> <td>String</td> <td>-</td> <td>依赖字段名称</td></tr> <tr><td>dependValue</td> <td>*</td> <td>-</td> <td>依赖字段的值，即依赖字段的值等于该值才会显示，可以设置匹配函数</td></tr> <tr><td>cascade</td> <td>String</td> <td>-</td> <td>级联的上级字段名称，需要与loader配合加载数据</td></tr> <tr><td>loader</td> <td>Function</td> <td>-</td> <td>加载数据函数,必须返回Promise</td></tr> <tr><td>dict</td> <td>String</td> <td>-</td> <td>字典名称，只是标识，需要与loader配合 或 表单的dictMap加载数据</td></tr> <tr><td>disabled</td> <td>Boolean</td> <td>-</td> <td>禁用</td></tr> <tr><td>readonly</td> <td>Boolean</td> <td>-</td> <td>只读</td></tr> <tr><td>placeholder</td> <td>String</td> <td>-</td> <td>占位文本</td></tr></tbody></table> <h2 id="使用方式"><a href="#使用方式" class="header-anchor">#</a> 使用方式</h2> <p>表单项组件有两种调用方式：</p> <ul><li>单独使用</li> <li>与<a href="/my/ui/components/form.html">MyForm</a>结合使用</li></ul> <h3 id="单独使用"><a href="#单独使用" class="header-anchor">#</a> 单独使用</h3> <p>表单项组件可单独使用。注意：单独使用时与表单相关的公共参数功能即失效。用法：</p> <!----><p>单独使用等价于：</p> <div class="language-html line-numbers-mode"><pre class="language-html"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>el-input</span> <span class="token attr-name">placeholder</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>请输入标题<span class="token punctuation">&quot;</span></span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>title<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>el-input</span><span class="token punctuation">&gt;</span></span>
</code></pre> <div class="line-numbers-wrapper"><span class="line-number">1</span><br></div></div><h3 id="结合myform"><a href="#结合myform" class="header-anchor">#</a> 结合MyForm</h3> <p>通常表单项需要结合MyForm使用，才能能便利实现数据录入功能。</p> <!----><p>等价于：</p> <div class="language-html line-numbers-mode"><pre class="language-html"><code>  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>el-form</span> <span class="token attr-name">:model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>model<span class="token punctuation">&quot;</span></span> <span class="token attr-name">@submit</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>handleSubmit<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>el-form-item</span> <span class="token attr-name">prop</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>title<span class="token punctuation">&quot;</span></span> <span class="token attr-name">label</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>标题<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
       <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>el-input</span> <span class="token attr-name">v-model</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>title<span class="token punctuation">&quot;</span></span> <span class="token attr-name">placeholder</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>请输入标题<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>el-input</span><span class="token punctuation">&gt;</span></span>
    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>el-form-item</span><span class="token punctuation">&gt;</span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>el-form</span><span class="token punctuation">&gt;</span></span>

</code></pre> <div class="line-numbers-wrapper"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br></div></div><h2 id="通用功能"><a href="#通用功能" class="header-anchor">#</a> 通用功能</h2> <h3 id="样式设置"><a href="#样式设置" class="header-anchor">#</a> 样式设置</h3> <p>通过设置表单项宽度可实现行列排版</p> <!----><h3 id="输入组件参数"><a href="#输入组件参数" class="header-anchor">#</a> 输入组件参数</h3> <p>表单项内部都包含了一个输入组件，如：my-input 是 el-form-item 和 el-input 的结合体， 内部输入组件就是el-input.
输入组件的参数通过 <code>props</code> 设置。</p> <!----><h3 id="选项数据"><a href="#选项数据" class="header-anchor">#</a> 选项数据</h3> <p>有选项数据的输入组件通过<code>options</code>参数设置。以下表单项组件有选项：</p> <ul><li>my-select</li> <li>my-checkbox</li> <li>my-radio</li> <li>my-cascader</li> <li>my-tag-select</li> <li>my-tree-select</li></ul> <!----><h3 id="数据加载函数"><a href="#数据加载函数" class="header-anchor">#</a> 数据加载函数</h3> <p><code>options</code> 的数据也可以通过函数加载，常用在需要远程请求获取的数据</p> <!----><h3 id="折叠"><a href="#折叠" class="header-anchor">#</a> 折叠</h3> <p>设置 <code>collapsible</code> 可以实现折叠表单项，常用在筛选条件多的时候，把次要的折叠起来，节省空间。</p> <!----><h3 id="依赖"><a href="#依赖" class="header-anchor">#</a> 依赖</h3> <p>当表单项显示的条件是根据其他表单项的值来确定时，可以设置 <code>depend</code>、<code>dependValue</code> 来实现。</p> <!----><h3 id="级联"><a href="#级联" class="header-anchor">#</a> 级联</h3> <p>当表单项的选项数据时根据其他表单项的值来决定的，设置 <code>cascade</code>，配合loader来加载选项数据</p> <!----><h2 id="表单项组件"><a href="#表单项组件" class="header-anchor">#</a> 表单项组件</h2> <p>表单项组件包括以下组件。</p> <h3 id="autocomplete-自动完成"><a href="#autocomplete-自动完成" class="header-anchor">#</a> Autocomplete 自动完成</h3> <p>根据输入内容提供对应的输入建议。</p> <p>基于 <code>el-autocomoplete</code> 实现, 兼容 <code>el-autocomoplete</code> 全部的参数、插槽和事件。</p> <!----><h3 id="cascader-级联选择器"><a href="#cascader-级联选择器" class="header-anchor">#</a> Cascader 级联选择器</h3> <p>基于 <code>el-cascader</code> 实现, 兼容 <code>el-cascader</code> 全部的参数、插槽和事件。</p> <p>数据源： <a href="/my/files/tree.html">$docs/data/tree.json</a></p> <!----><h3 id="checkbox-多选框"><a href="#checkbox-多选框" class="header-anchor">#</a> Checkbox 多选框</h3> <h3 id="colorpicker-颜色选择器"><a href="#colorpicker-颜色选择器" class="header-anchor">#</a> ColorPicker 颜色选择器</h3> <h3 id="datepicker-日期时间选择器"><a href="#datepicker-日期时间选择器" class="header-anchor">#</a> DatePicker 日期时间选择器</h3> <h3 id="editor-富文本编辑器"><a href="#editor-富文本编辑器" class="header-anchor">#</a> Editor 富文本编辑器</h3> <h3 id="input-文本输入框"><a href="#input-文本输入框" class="header-anchor">#</a> Input 文本输入框</h3> <h3 id="inputnumber-数字输入框"><a href="#inputnumber-数字输入框" class="header-anchor">#</a> InputNumber 数字输入框</h3> <h3 id="radio-单选框"><a href="#radio-单选框" class="header-anchor">#</a> Radio 单选框</h3> <h3 id="range-范围输入框"><a href="#range-范围输入框" class="header-anchor">#</a> Range 范围输入框</h3> <h3 id="rate-评分"><a href="#rate-评分" class="header-anchor">#</a> Rate 评分</h3> <h3 id="select-下拉选择框"><a href="#select-下拉选择框" class="header-anchor">#</a> Select 下拉选择框</h3> <h3 id="slider-滑块"><a href="#slider-滑块" class="header-anchor">#</a> Slider 滑块</h3> <h3 id="switch-开关"><a href="#switch-开关" class="header-anchor">#</a> Switch 开关</h3> <h3 id="taginput-标签输入框"><a href="#taginput-标签输入框" class="header-anchor">#</a> TagInput 标签输入框</h3> <h3 id="tagselect-标签选择"><a href="#tagselect-标签选择" class="header-anchor">#</a> TagSelect 标签选择</h3> <h3 id="treeselect-下拉树选择框"><a href="#treeselect-下拉树选择框" class="header-anchor">#</a> TreeSelect 下拉树选择框</h3></div> <footer class="page-edit"><!----> <!----></footer> <div class="page-nav"><p class="inner"><span class="prev">
      ←
      <a href="/my/ui/components/form.html" class="prev">
        Form 表单
      </a></span> <span class="next"><a href="/my/ui/components/location-picker.html">
        LocationPicker 经纬度提取器
      </a>
      →
    </span></p></div> </main></div><div class="global-ui"></div></div>
    <script src="/my/assets/js/app.fc4964fc.js" defer></script><script src="/my/assets/js/513.edb84f11.js" defer></script><script src="/my/assets/js/1431.f2b77d63.js" defer></script><script src="/my/assets/js/958.935c6658.js" defer></script>
  </body>
</html>
